<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>问卷调查</title>
    <meta name="description" content="大一作业，热爱火影多年，借由此页面来表达我对火影的热爱，它是我的青春，供大家学习使用">
    <meta name="Keywords" content="火影,Naruto,静态页面">
    <link rel="icon" href="../shq-splendid.ico">
    <link rel="stylesheet" href="../css/base.css">
    <link rel="stylesheet" href="../css/check.css">
    <link rel="stylesheet" href="../css/font-awesome-4.7.0/css/font-awesome.css">

</head>
<script type="text/javascript">

</script>
<body>
<div class="top">
</div>
<div class="nav w">
    <ul>
        <li><a href="introduce.html">首页</a></li>
        <li><a href="grow.html">成长之路</a></li>
        <li><a href="role.html">登场人物</a></li>
        <li><a href="author.html">作者简介</a></li>
        <li><a href="check.html">问卷调查</a></li>
        <li><a href="movie.html">剧场版介绍</a></li>
    </ul>
</div>
<div class="main w" id="main">
    <div class="logo_box">
        <h3>欢迎你,请先登录</h3>
        <form action="#" name="f" method="post">
            <div class="input_outer">
                <span class="fa fa-user-o"></span>
                <input name="logname" class="text" id="username"  type="text" placeholder="请输入账户">
            </div>
            <div class="input_outer">
                <span class="fa fa-lock"></span>
                <input name="logpass" class="text" id="password" style="position:absolute; z-index:100;"value="" type="password" placeholder="请输入密码">
            </div>
            <div class="mb2" id="btu"><a class="act-but submit" href="javascript:;" style="color: #FFFFFF">登录</a></div>
        </form>
    </div>
    <script type="text/javascript">
        window.onload=function (){
            var btu=document.getElementById('btu');
            var main=document.getElementById('main');
            var main_check=document.getElementById('main-check');
            btu.onclick=function (){

                var user=document.getElementById('username').value;
                var pass=document.getElementById('password').value;
                alert('您输入的用户名是:'+user+'\n'+"您输入的密码是:"+pass);
                main.classList.add('show');
                main_check.classList.remove('show');

            }
        }

    </script>
</div>
<div class="main-check w show" id="main-check">
    <!--主体左边-->
    <div class="main-left">
        <div class="intro">
            <p>火影知多少</p>
        </div>
        <div class="problem">
            <table>
                <tr>
                    <th colspan="2">1.鸣人的性别?</th>
                </tr>
                <tr>
                    <td>A.<input type="radio" name="sex" value="male"/>男</td>
                    <td>B.<input type="radio" name="sex" value="female"/>女</td>
                </tr>
            </table>
        </div>
        <div class="problem">
            <table>
            <tr>
                <th colspan="3">2.鸣人最喜欢的食物?</th>
            </tr>
            <tr>
                <td>A.<input type="radio" name="food"  value="1"/>拉面</td>
                <td>B.<input type="radio" name="food"  value="2"/>叉烧饭</td>
                <td>C.<input type="radio" name="food" value="3"/>寿司</td>
                <td>D.<input type="radio" name="food"  value="4"/>丸子</td>
            </tr>
        </table>
        </div>
        <div class="problem"> <table>
            <tr>
                <th colspan="3">3.五影指的是哪五影[多选题]</th>
            </tr>
            <tr>
                <td><input type="checkbox" name="select"/>风影
                    <input type="checkbox" name="select"/>土影
                    <input type="checkbox" name="select"/>雷影<br/>
                    <input type="checkbox" name="select"/>雨影
                    <input type="checkbox" name="select"/>火影
                    <input type="checkbox" name="select"/>水影</td>
            </tr>
        </table></div>
        <div class="problem"><table>
            <tr>
                <th colspan="3">4.会使用倍化术的忍者是[单选题]</th>
            </tr>
            <tr>
                <td>A.<input type="radio" name="beihua"  value="w"/>
                    秋道甲次</td>
                <td>B.<input type="radio" name="beihua"  value="e"/>
                    秋道乙次</td>
                <td>C.<input type="radio" name="beihua" value="r"/>
                    秋道丙次</td>
                <td>D.<input type="radio" name="beihua"  value="t"/>
                    秋道丁次</td>
            </tr>
        </table></div>
        <div class="problem"><table>
            <tr>
                <th colspan="3">5.亲热天堂的作者是[单选题] </th>
            </tr>
            <tr>
                <td>A.<input type="radio" name="zuozhe"  value="1"/>
                    旗木卡卡西</td>
                <td>B.<input type="radio" name="zuozhe"  value="2"/>
                    自来也</td>
                <td>C.<input type="radio" name="zuozhe" value="3"/>
                    纲手</td>
                <td>D.<input type="radio" name="zuozhe"  value="4"/>
                    三代火影</td>
            </tr>
        </table></div>
        <div class="problem"> <table>
            <tr>
                <th colspan="3">6.鸣人的父亲是几代火影？[单选题]</th>
            </tr>
            <tr>
                <td>A.<input type="radio" name="int"  value="1"/>
                    一代</td>
                <td>B.<input type="radio" name="int"  value="2"/>
                    二代</td>
                <td>C.<input type="radio" name="int" value="3"/>
                    三代</td>
                <td>D.<input type="radio" name="int"  value="4"/>
                    四代</td>
            </tr>
        </table></div>
        <div class="problem"><table>
            <tr>
                <th colspan="3">7.鸣人是几代火影？[单选题]</th>
            </tr>
            <tr>
                <td>A.<input type="radio" name="int2"  value="1"/>
                    一代</td>
                <td>B.<input type="radio" name="int2"  value="2"/>
                    二代</td>
                <td>C.<input type="radio" name="int2" value="3"/>
                    三代</td>
                <td>D.<input type="radio" name="int2"  value="4"/>
                    四代</td>
            </tr>
        </table></div>
        <div class="problem"><table>
            <tr>
                <th colspan="3">8.鸣人体内的尾兽是几尾？[单选题]</th>
            </tr>
            <tr>
                <td>A.<input type="radio" name="int3"  value="1"/>
                    三尾</td>
                <td>B.<input type="radio" name="int3"  value="2"/>
                    五尾</td>
                <td>C.<input type="radio" name="int3" value="3"/>
                    八尾</td>
                <td>D.<input type="radio" name="int3"  value="4"/>
                    九尾</td>
            </tr>
        </table></div>



    <!--    主体右边-->

</div>
    <div class="main-right">
        <div class="right-top">
            <div class="head">
                <p>最 新 漫 画</p>
            </div>
            <div class="manhua">
                <div class="img">
                    <img src="../images/最新漫画.jpg" alt="">
                    <p>更新日期:2020-10-06</p>
                </div>

            </div>
        </div>

        <div class="right-middle">
            <div class="head">
                <p>最 新 动 漫</p>
            </div>
            <div class="dongman">
                <div class="img">
                    <img src="../images/最新动漫.jpg" alt="">
                    <p>更新日期:2020-10-06</p>
                </div>

            </div>

        </div>
        <div class="right-bottom">
            <div class="head">
                <p>推 荐 文 章</p>
            </div>
            <div class="artical">
                <ul>
                    <li>
                        <span></span>
                        <a href="http://www.narutom.com/article/22161.html" target="_blank">
                            <p>1.火影忍者丨为之倾倒的11大理由!</p>
                            <p2>[11-02]</p2>
                        </a>

                    </li>

                    <li>
                        <span></span>
                        <a href="http://www.narutom.com/article/22161.html" target="_blank">
                            <p>2.思公子兮徒离忧——宇智波鼬</p>
                            <p2>[11-02]</p2>
                        </a>

                    </li>
                    <li>
                        <span></span>
                        <a href="http://www.narutom.com/article/22161.html" target="_blank">
                            <p>3.寄火影——那份最初的感动!!</p>
                            <p2>[11-02]</p2>
                        </a>

                    </li>
                    <li>
                        <span></span>
                        <a href="http://www.narutom.com/article/22161.html" target="_blank">
                            <p>4.青春的相守，岁月的痕迹</p>
                            <p2>[11-02]</p2>
                        </a>

                    </li>
                    <li>
                        <span></span>
                        <a href="http://www.narutom.com/article/22161.html" target="_blank">
                            <p>5.火影之一人一首成名曲!</p>
                            <p2>[11-02]</p2>
                        </a>

                    </li>
                </ul>

            </div>

        </div>
    </div>
</div>
<footer>
    Copyright©2017 郑州大学宋沆群 All Rights Reserved. <br/>
    建议采用使用的浏览器有：IE9.0、Firefox 4 、Safari5.1.7 、Chrome13 和 Opera11.5或更高版本。 <br/> 技术支持：宋沆群
</footer>
</body>
</html>